/*font face */
@font-face {
    font-family: Proxima-Nova;
    src: url('../fonts/ProximaNova.otf') format('truetype');
}
body {
    marign: 0;
    background-image: url('../images/background.png');
    font-family: Proxima-Nova;
}
.custom-container {
    /*background-color: #ffffff;*/
    background-image: url('../images/contaiter.png');
    margin-top: 60px;
    width: 1125px;

    box-shadow: 10px 10px 5px #e0e0e0 ;
    -moz-box-shadow: 10px 10px 5px #e0e0e0 ;
    -webkit-box-shadow: 10px 10px 5px #e0e0e0 ;
    -o-box-shadow: 10px 10px 5px #e0e0e0 ;
    -ms-box-shadow: 10px 10px 5px #e0e0e0 ;
}

/* Header nav */
.logo {
    margin: -15px auto;
}
.input-group {
    max-width:360px; 
    margin-right: 10px;
}
.nav-icon { 
    margin-right: 10px;
}
.navbar-inverse{
    background-color: #3b5998;
    border-color: #3b5998;
    font-weight: bold;
}
.navbar-inverse .navbar-nav > li > a {
    color: #fff;
}
.navbar-inverse .navbar-nav > li > a:hover, 
.navbar-inverse .navbar-nav > li > a:focus {
    color: #fff;
    background-color: transparent;
}

.navbar-inverse .navbar-nav .active > a,
.navbar-inverse .navbar-nav .active > a:hover,
.navbar-inverse .navbar-nav .active > a:focus {
    color: #C2C5CC;
    font-weight: bold;
    background-color: transparent;
}
/* body */
.breadcrumbs {
    margin: 0.2em;
}
.breadcrumbs ul {
    margin: 0;
    padding: 0;
    list-style: none;
    overflow: hidden;
    width: 100%;
}
.breadcrumbs ul li {
    float: left;
    margin: 0 .2em 0 1em;
}
.breadcrumbs ul li:first-child {
    margin-left: 0 !important;
}
.breadcrumbs ul li:first-child a:before {
    content: normal;
}
.breadcrumbs ul li:last-child {
    background: none;
}
.breadcrumbs ul li:last-child a {
    color: #9f7777;
}
.breadcrumbs ul li:last-child:after,
.breadcrumbs ul li:last-child:before {
    content: normal;
}
.breadcrumbs ul a {
    background: #f1f1ed;
    padding: .5em 1em;
    float: left;
    text-decoration: none;
    color: #2e92cf;
    position: relative;
}
.breadcrumbs ul a:hover {
    background: #f9f9f4;
    color: #2e92cf;
}
.breadcrumbs ul a:hover:before {
    border-color: #f9f9f4 #f9f9f4 #f9f9f4 transparent;
}
.breadcrumbs ul a:hover:after {
    border-left-color: #f9f9f4;
}
.breadcrumbs ul a:before {
    content: "";
    position: absolute;
    top: 50%;
    margin-top: -1.5em;
    border-width: 1.5em 0 1.5em 1em;
    border-style: solid;
    border-color: #f1f1ed #f1f1ed #f1f1ed transparent;
    left: -1em;
    margin-left: 1px;
}
.breadcrumbs ul a:after {
    content: "";
    position: absolute;
    top: 50%;
    margin-top: -1.5em;
    border-top: 1.5em solid transparent;
    border-bottom: 1.5em solid transparent;
    border-left: 1em solid #f1f1ed;
    right: -1em;
    margin-right: 1px;
}
.breadcrumbs ul .active,
.breadcrumbs ul .active:hover {
    background: none;
}
.breadcrumbs ul .active a,
.breadcrumbs ul .active:hover a {
    color: #1d1d1d;
}
.breadcrumbs ul .active:hover a {
    color: #ffffff;
}
.breadcrumbs ul .active:after,
.breadcrumbs ul .active:before {
    content: normal;
}
.breadcrumbs.small li {
    margin: 0 .2em 0 .8em;
}
.breadcrumbs.small a {
    padding: .2em 1em;
    font-size: 11.9px;
}
.breadcrumbs.mini li {
    margin: 0 .2em 0 .6em;
}
.breadcrumbs.mini a {
    padding: .1em 1em;
    font-size: 10.5px;
}
.highlight{
    padding: 9px 14px;
    margin-bottom: 14px;
    background-color: #fff;
    border: 1px solid #e1e1e8;
    border-radius: 4px;
    margin: auto auto auto auto;

}

.highlight .avatar {
    width: 80px;
    height: 80px;
    margin-left: -15px;
    border: 5px solid #47e8f7;
    border-radius: 6px;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    -ms-border-radius: 6px;
    -o-border-radius: 6px;
}
.highlight .avatar_activity {
    width: 200px;
    height: 170px;
    margin-left: -15px;
    margin-top: -5px;
    border: 1px solid #ffffff;
    border-radius: 6px;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    -ms-border-radius: 6px;
    -o-border-radius: 6px;
}
.image_activity {
    width: 300px;
    height: 160px;
    margin-left: -15px;
    margin-top: -5px;
    border: 1px solid #ffffff;
    border-radius: 6px;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    -ms-border-radius: 6px;
    -o-border-radius: 6px;
}
.highlight .row {
    padding-left: 10px;
    padding-right: 10px;
}
.highlight h3, .name, .email, .company {
    font-weight: bold;
}

/* Footer */
.footer { 
    background-image: url('../images/footer_background.jpg');
    margin-top: 10px;
    border-top: 3px solid #ff0065;
}
.footer .logo {
    margin: 50px auto 0px auto;
}
.footer .title {
    color: #ff0065;
    font-family: "VNI-Truck";
    border-bottom: 1.5px dashed #aaaaaa;
    margin: 5px auto 10px auto;
}
.footer .content {
    font-size: 30 px;
    font-family: 'VNI-Hobo';
    color: #ffffff;
}
.footer .content span {
    color: #ff0065;
}
.footer .image {
    width: 80px;
    height: 80px;
    border: 5px solid #ffffff;
    margin: 5px auto;
    border-radius: 6px;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    -ms-border-radius: 6px;
    -o-border-radius: 6px;
}
.footer .button {
    margin-top: 5px;
}
.footer .end-footer{
    border-top: 1px solid #ff0065;
    color: #ffffff;
}

/* Dropdown menu */

ul.nav li > ul, ul.nav li > ul li > ul {
    display: none;
    position: absolute;
    left:0;
    width: 100%;
}

ul.nav ul li a {
    border-bottom: 1.5px solid #eeeeee;
}

ul.nav ul li.last a {
    border-bottom: 0;
}

ul.nav li > ul li > ul{
    top: 10px;
}

/*Refer to all list item */
ul.nav > li, ul.nav li > ul li, ul.nav li > ul li > ul li{
    list-style-type: none;
    display: block;
    position: relative;
}

/*Refer to all anchor item*/
ul.nav li > ul li a, ul.nav li > ul li > ul li a{
    text-decoration: none;
    display: block;
    padding: 8px;
}

/*Refer to all anchor item :hover*/
ul.nav > li a:hover, ul.nav li > ul li a:hover, ul.nav li > ul li > ul li a:hover{
    color: #ff0065;
    text-decoration: none;
}

/*display sub-menu*/
ul.nav li:hover > ul {
    display: block;
    left: 0;
    
}

/* Sidebar navigation */
.nav-sidebar {
    /*margin-right: -21px; /* 20px padding + 1px border 
    margin-left: -30px;
    padding: 20px 0 10px 0;*/
    background-color: #fafafa;
    /*box-shadow: 5px 10px 5px #e0e0e0 ;
    -moz-box-shadow: 5px 10px 5px #e0e0e0 ;
    -webkit-box-shadow: 5px 10px 5px #e0e0e0 ;
    -o-box-shadow: 5px 10px 5px #e0e0e0 ;
    -ms-box-shadow: 5px 10px 5px #e0e0e0 ;*/
}
.nav-sidebar img {
    //margin: 0 auto 0 auto;
    border: 2px solid #ebebeb;
}
.nav-sidebar h3 {
    font-family: 'VNI-Hobo';
    color: #d82727;
    text-align: center;
}
.nav-sidebar > li > a {
    padding-right: 20px;
    padding-left: 20px;
    color: #98999a;
    font-size: 13px;
    font-weight: bold;
}
.slide .item > img {
    width: 100%;
}
.myshadow {
    box-shadow: 5px 5px 5px #e0e0e0 ; 
    -moz-box-shadow: 5px 5px 5px #e0e0e0 ;
    -webkit-box-shadow: 5px 5px 5px #e0e0e0 ;
    -o-box-shadow: 5px 5px 5px #e0e0e0 ;
    -ms-box-shadow: 5px 5px 5px #e0e0e0 ;
}
.bg-mycolor{
    background-color: #f7f7f9;
}

li.center-active, li.center-active a{
    color: #ff0065;
    background-color: #bdc3c7;
}
/* vertical alignment styles */
.col-top {
    vertical-align:top;
}
.col-middle {
    vertical-align:middle;
}
.col-bottom {
    vertical-align:bottom;
}

/* fix firefox responsive images */
.img-responsive {
    width: 100%
}

/* columns of same height styles */
.container-xs-height {
    display:table;
    padding-left:0px;
    padding-right:0px;
}
.row-xs-height {
    display:table-row;
}
.col-xs-height {
    display:table-cell;
    float:none;
}
@media (min-width: 768px) {
    .container-sm-height {
        display:table;
        padding-left:0px;
        padding-right:0px;
    }
    .row-sm-height {
        display:table-row;
    }
    .col-sm-height {
        display:table-cell;
        float:none;
    }
}
@media (min-width: 992px) {
    .container-md-height {
        display:table;
        padding-left:0px;
        padding-right:0px;
    }
    .row-md-height {
        display:table-row;
    }
    .col-md-height {
        display:table-cell;
        float:none;
    }
}
@media (min-width: 1200px) {
    .container-lg-height {
        display:table;
        padding-left:0px;
        padding-right:0px;
    }
    .row-lg-height {
        display:table-row;
    }
    .col-lg-height {
        display:table-cell;
        float:none;
    }
}
.col-xs-height{
    padding-top: 0px;
}
.navshadow{
    background-color: #fafafa;
    box-shadow: 5px 10px 5px #e0e0e0;
    -moz-box-shadow: 5px 10px 5px #e0e0e0;
    -webkit-box-shadow: 5px 10px 5px #e0e0e0;
    -o-box-shadow: 5px 10px 5px #e0e0e0;
    -ms-box-shadow: 5px 10px 5px #e0e0e0;
}
#headbar .pagination{
    margin: 0;
}
#no-margin .pagination{
    margin: 0;
}
.box-avatar{
    width: 80px;
    height: 80px;
    margin-left: -15px;
    border: 5px solid #47e8f7;
    border-radius: 6px;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    -ms-border-radius: 6px;
    -o-border-radius: 6px;
}
/*clock coundown*/
.clock-coundown{
    display: block;
    margin-left: auto;
    margin-right: auto; 
}